<style>
    .apply_before figure{
        box-shadow: 0 0 6px 2px #ddd;
        height: 150px;
        padding:0 20px;
        width:92%;
        box-sizing: border-box;
        margin:15px auto;
        border-radius: 5px;
        position: relative;
        font-size: 12px;
    }
   
    .apply_before figure img{
        width:23%;
        position:absolute;
        right: 4%;
        top: 0;bottom: 0;
        margin: auto;
    }
    .apply_before figure figcaption{
        width:70%;
        float: left;
    }
    .apply_before figure figcaption h4{
        height: 50px;
        line-height: 50px;
        font-size: 14px;
    }
    .apply_before figure figcaption ul li{
        line-height: 22px;
        position: relative;
        padding-left: 10px;
    }
    .apply_before figure figcaption ul li::before{
        content: "·";
        font-size: 20px;
        position:absolute;
        left: 0;
    }
    .apply_before figure button{
        font-size: 12px;
        line-height: 25px;
        padding: 5px 15px;
        border-radius: 25px;
        margin-top: 10px;
        background: #47C1E5;

    }
</style>
<template>
<!-- 申请的步骤1 展示所需资料 -->
    <div class="apply_before">  
        <figure>
    　　　　 <figcaption>
                <h4>基础资料所需：</h4>
                <ul>
                    <li>名称及其用途</li>
                    <li>照片 (主、俯、仰、左、右、后、立体图6个角度的照片)</li>
                    <li>其他外观设计说明</li>
                </ul>
    　　　　   </figcaption>
            <img src='static/ready_basis.png'>
            <div class="clear"></div>
　　　  </figure>
        <figure>
    　　　　<figcaption>
                <h4>申请人员资料所需：</h4>
                <ul>
                    <li>申请人资料</li>
                    <li>设计人资料</li>
                    <li>费减备案</li>
                </ul>
    　　　　</figcaption>
            <img src='static/ready_personnel.png'>
            <div class="clear"></div>
　　　  </figure>
        <figure>
    　　　　 <figcaption>
                <h4>代理证明所需：</h4>
                <ul>
                    <li>专利委托书</li>
                    <li>请下载打印盖章后拍照上传</li>
                </ul>
                <button>
                    <router-link to="book_case">下载委托书</router-link>
                </button>
    　　　　 </figcaption>
            <img src='static/ready_ prove.png'>
            <div class="clear"></div>
　　　  </figure>
        <button ref='btn' class="fm_btn">
            <router-link to="add_product">我准备好了,开始申请</router-link>
        </button>
    </div>
</template>


